import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)
var car = JSON.parse(localStorage.getItem('car') || '[]')
var store = new Vuex.Store({
    state:{
      car: car  //存放选中的商品信息
    },
    mutations:{
      addToCar(state,goodsinfo){
          //点击加入购物车，把商品信息保存到car中
          // 需求分析  1如果car中已经存在该商品，就只让该商品的数量增加
                  //  2 如果没有就直接将该信息push到car中
                  
        var flag = false  //先默认没有该商品
        //循环car，看car中是否含有该商品
        state.car.some(item => {
          if(item.id == goodsinfo.id){
            item.count += parseInt(goodsinfo.count) 
            flag = true
            return true  //结束循环
          }
        })
        // 如果最终，循环完毕，得到的 flag 还是 false，则把商品数据直接 push 到 购物车中
        if(!flag){
          state.car.push(goodsinfo)
        }
        //为了避免每次刷新之后  购物车中的数据就没有了  
        // 当 更新 car 之后，把 car 数组，存储到 本地的 localStorage 中
        localStorage.setItem("car",JSON.stringify(state.car))     
      },


      //让购物车中的选择的数量同步到store中
      updateCar(state,goodsinfo){
        state.car.some( item => {
          if(item.id == goodsinfo.id){
            item.count = parseInt(goodsinfo.count)
            return true
          }
        })
        // 当 更新 car 之后，把 car 数组，存储到 本地的 localStorage 中
        localStorage.setItem("car",JSON.stringify(state.car))
      },

       //根据组件通过参数传过来的id删除car中对应的元素
       removeCar(state,id){
         state.car.some((item,i) => {
           if(item.id == id){
             state.car.splice(i,1)
             return true
           }
         })
        // 当 更新 car 之后，把 car 数组，存储到 本地的 localStorage 中
        localStorage.setItem("car",JSON.stringify(state.car))
       },

       //把selected改变的状态更新到store中
       updateSelected(state,info){
          state.car.some( item => {
            if(item.id == info.id){
              item.selected = info.selected
              return true 
            }
          })
          // 并把最新的数据保存到本地localstorage中
          localStorage.setItem('car',JSON.stringify(state.car))
       }
    },
   
    getters:{ 
      //获取car中所有商品的数量
      getAllCount(state){
        var allCount = 0
        state.car.forEach(item => {
          allCount += item.count
        })
        return allCount
      },
      //获取一个新的对象以商品id为属性，数量为值   {88:2,89:1},初始化购物车中选中商品的数量
      getGoodsCount(state){
        var cobj = {}
        state.car.forEach(item => {
          cobj[item.id] = item.count
        })
        return cobj
      },
      //让被选中的商品高亮显示
      getGoodsSelected(state){
        var o = {}
        state.car.forEach(item => {
          o[item.id] = item.selected
        })
        return o
      },
      // 计算被选中商品的数量，和总价格
      getNumber(state){
        var o ={
          count:0,
          amount:0
        }
        state.car.forEach(item => {
          if(item.selected){
            o.count += item.count
            o.amount += item.count*item.price
          }
        })
        return o
      }
      
    }
})

export default store